<!DOCTYPE html>
<html lang="en">

<head>
	#include("./common/head.htm")
</head>

<body>
	#include("./common/header.htm")
	<div id="mainBody">
		<div class="container">
			<div class="row">
				#include("./common/sidebar.htm")
				<div class="span9" id="cart_info">
					<div>
						<ul class="breadcrumb">
							<li><a href="/view/catalog-main.html">首页</a> <span class="divider">/</span></li>
							<li class="active">购物车</li>
						</ul>
						<h3> 购物车 <small>{{getCartNums()}} 件商品 </small><a href="/view/catalog-main.html" class="btn btn-large pull-right"><i
									class="icon-arrow-left"></i> 继续购物 </a></h3>
						<hr class="soft" />
						<table class="table table-bordered">
							<thead>
								<tr>
									<th>店铺名</th>
									<th>商品图片</th>
									<th>商品描述</th>
									<th>规格</th>
									<th>数量/更新</th>
									<th>单价</th>
									<th>折扣</th>
									<th>总价</th>
								</tr>
							</thead>
							<tbody>
								<tr v-for="(item,index) in cartItems">
									<td>{{item.shopname}}</td>
									<td>
										<div style="background-size:100% 100%;" v-html="returnItempicture(index)"></div>
									</td>
									<td>{{item.description}}</td>
									<td>
										{{item.attrdescription}} <br>
										<div
											style="width: 20%;padding: 5px;border-radius: 20px;background-color: rgb(211, 206, 206);">
											<a href="#updateAttr" role="button" data-toggle="modal"
												style="padding-right:0">
												<small @click="updateAttr(index)"
													style="color: rgb(73, 72, 72);">选规格</small>
											</a>
											<!--                        登录浮窗-->
											<div :name="index" id="updateAttr" class="modal hide fade in" role="dialog"
												aria-labelledby="updateAttr" aria-hidden="false">
												<div class="row-fluid">
													<div class="span8">
														<table>
															<tr v-for="attr in attrs">
																<td>{{attr.attrname}}：
																</td>
																<td>
																	<span v-for="attrval in attr.attrList">
																		<span>{{attrval.attrvalue}}</span>、<input
																			@click="changepicture(attrval.src,attr.attrname)"
																			type="radio" :value="attrval.rate"
																			:name="attr.attrname">
																	</span>
																</td>
															</tr>
														</table>
														<div class="row-fluid">
															<div class="span3">
															</div>
															<div class="span3">
																<button class="btn btn-success"
																	@click="comfirmAttr(attrindex)">确定</button>
															</div>
															<div class="span3">
																<button id="cancel" data-dismiss="modal"
																	@click="cancelAttr(attrindex)">取消</button>
															</div>
															<div class="span3">
															</div>
														</div>
													</div>
													<div class="span4">
														<div style="background-size:100% 100%; margin: 10%;"
															v-html="returnAttrpicture()"></div>
													</div>
												</div>
											</div>
										</div>
									</td>
									<td>
										<div class="input-append"><input @blur="updatenum(index)" class="span1"
												style="max-width:34px" v-model="item.num" id="appendedInputButtons"
												size="16" type="text">
											<button @click="addnum(index)" class="btn" type="button"><i
													class="icon-plus"></button>
											<button @click="subnum(index)" class="btn" type="button"><i
													class="icon-minus"></button>
											<button @click="removecartItem(index)" class="btn btn-danger"
												type="button"><i class="icon-remove icon-white"></i></button>
										</div>
									</td>
									<td>${{item.price.toFixed(2)}}</td>
									<td>${{item.discount.toFixed(2)}}</td>
									<td>${{item.specialprice.toFixed(2)}}</td>
								</tr>

								<tr>
									<td colspan="7" style="text-align:right">价格总计: </td>
									<td> ${{sumprice.toFixed(2)}}</td>
								</tr>
								<tr>
									<td colspan="7" style="text-align:right">总折扣: </td>
									<td> ${{totaldiscount.toFixed(2)}}</td>
								</tr>
								<tr>
									<td colspan="7" style="text-align:right">总优惠卷抵扣: </td>
									<td> ${{couponsdiscount.toFixed(2)}}</td>
								</tr>
								<tr>
									<td colspan="7" style="text-align:right"><strong>总计
											$({{sumprice.toFixed(2)}}-{{totaldiscount.toFixed(2)}} -
											{{couponsdiscount.toFixed(2)}}) =</strong></td>
									<td class="label label-important" style="display:block"> <strong>
											${{(sumprice-totaldiscount-couponsdiscount).toFixed(2)}} </strong></td>
								</tr>
							</tbody>
						</table>
						<div class="row-fluid">
							<div class="span6">
								<div class="accordion" id="accordion">
									<div class="accordion-group">
										<div class="accordion-heading">
											<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion"
												href="#collapseOne">
												所有优惠卷
											</a>
										</div>
										<div id="collapseOne" class="accordion-body collapse in">
											<div v-for="coupon in allcoupons" class="accordion-inner">
												<div style="margin: 10px;">{{coupon.shopname}}专属优惠卷</div>
												<hr>
												<div style="margin: 10px; color: gray;">使用条件：满{{coupon.fullminus}} 减
													{{coupon.discount}}</div>
											</div>
										</div>
									</div>
								</div>
							</div>
							<div class="span6">
								<div class="accordion" id="accordion1">
									<div class="accordion-group">
										<div class="accordion-heading">
											<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion1"
												href="#collapseTwo">
												可用优惠卷
											</a>
										</div>
										<div id="collapseTwo" class="accordion-body collapse in">
											<div v-for="usefulcoupon in usefulcoupons" class="accordion-inner">
												<div style="margin: 10px;">{{usefulcoupon.shopname}}专属优惠卷</div>
												<hr>
												<div style="margin: 10px;color:red">满足条件：满{{usefulcoupon.fullminus}} 减
													{{usefulcoupon.discount}}</div>

												<div class="row-fluid">
													<div class="span4">
														<div style="margin: 10px;">选择使用</div>
													</div>
													<div class="span8">
														<div style="margin: 10px;"><input @click="selectcoupons()"
																type="radio" :name="usefulcoupon.shopid"
																:value="usefulcoupon.couponid"></div>
													</div>
												</div>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="row-fluid well">
							<div class="span5">
								<h5 class="accordion">{{receivingAddr}}</h5>
							</div>
							<div class="span4 pull-right">
								<button class="btn btn-large btn-primary pull-right" data-toggle="modal"
									data-target="#receiving-form">选择收货地址</button>
							</div>
						</div>
						<div id="receiving-form" class="modal hide fade in" tabindex="-1" role="dialog"
							aria-labelledby="login" aria-hidden="false">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
								<h3>请选择收货地址</h3>
							</div>
							<div class="modal-body">
								<form class="form-horizontal loginFrm">
									<div v-for="receiving in receivings" class="control-group">
										<input type="radio" v-model="receivingid" :value="receiving.receivingid"
											name="receiving-choice" @change="changeReceiving()">
										<label class="pull-right">地址:
											{{receiving.addrcoutry+receiving.addrprovince+receiving.addrcouty+receiving.addrdetails}},
											收款人电话: {{receiving.contactphone}}</label>
									</div>
								</form>
								<!-- <button type="submit" class="btn btn-success" @click="doLogin()">提交</button>
								<button class="btn" data-dismiss="modal" aria-hidden="true">关闭</button> -->

							</div>
							<div class="modal-footer">
								<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
								<a href="/view/receiving_all.html">新增或修改收货地址？点击这里</a>
							</div>
						</div>

					</div>
					<a href="/view/catalog-main.html" class="btn btn-large"><i class="icon-arrow-left"></i> 继续购物</a>
					<button @click="clearCart()" class="btn btn-large pull-right">清空购物车 <i
							class="icon-arrow-right"></i></button>

				</div>
			</div>
		</div>
	</div>
	<!-- MainBody End ============================= -->
	#include("./common/footer.htm")
</body>

</html>